<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录 - final-gateway</title>
    <link rel="shortcut icon" href="/res/img/favicon.ico" type="image/x-icon">
    <link href="/res/layui/css/layui.css" rel="stylesheet">
    <style>
        .demo-login-container {
            width: 320px;
            margin: 21px auto 0;
        }

        .demo-login-other .layui-icon {
            position: relative;
            display: inline-block;
            margin: 0 2px;
            top: 2px;
            font-size: 26px;
        }
    </style>
</head>
<body class="layui-anim layui-anim-downbit">
<h2 style="margin-top: 60px;text-align: center;margin-bottom: 20px">final-gateway 管理端登录</h2>
<div class="layui-form">
    <div class="demo-login-container">
        <div class="layui-form-item">
            <div class="layui-input-wrap">
                <div class="layui-input-prefix">
                    <i class="layui-icon layui-icon-username"></i>
                </div>
                <input type="text" name="username" value="" lay-verify="required" placeholder="用户名"
                       lay-reqtext="请填写用户名" autocomplete="off" class="layui-input" lay-affix="clear">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-wrap">
                <div class="layui-input-prefix">
                    <i class="layui-icon layui-icon-password"></i>
                </div>
                <input type="password" name="password" value="" lay-verify="required" placeholder="密   码"
                       lay-reqtext="请填写密码" autocomplete="off" class="layui-input" lay-affix="eye">
            </div>
        </div>
        <div class="layui-form-item">
            <a href="#forget" id="cp" style="float: right; margin-top: 7px;">忘记密码？</a>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="demo-login">登录</button>
        </div>
    </div>
</div>
<script src="/res/js/request.js"></script>
<script src="/res/layui/layui.js"></script>
<script>
    // 第一种实现方法
    if (window.self !== window.top) {
        console.log("当前页面不在 iframe 中");
        window.parent.location.href = '/'
    }
    layui.use(function () {
        var form = layui.form;
        var layer = layui.layer;
        var $ = layui.jquery
        // 提交事件
        form.on('submit(demo-login)', function (data) {
            layer.msg('登录中', {icon: 16, shade: 0.6, time: 1000});
            var field = data.field; // 获取表单字段值
            // 显示填写结果，仅作演示用
            // layer.alert(JSON.stringify(field), {
            //     title: '当前填写的字段值'
            // });
            request.post('/api/user/login', {
                data: field,
                success(data) {
                    console.log(data)
                    layer.msg(data.msg)
                    setTimeout(() => {
                        window.location.href = '/'
                    }, 1500)
                }
            })
            return false; // 阻止默认 form 跳转
        });

        $('#cp').click(function () {
            layer.alert('请修改 <b>conf/config.yaml</b> 中的账号密码，重启final-gateway', {
                title: '提示'
            });
        })
    });
</script>
</body>
</html>